<div id="doc-oc-demo2" class="am-offcanvas">
    <div class="am-offcanvas-bar">
        <div class="am-offcanvas-content">
            <h2>搜索</h2>


            <form action="${base}/book/search" method="post">
                <div class="am-input-group">
                    <input type="text" name="name" class="am-form-field" placeholder="输入书名搜索">
                    <span class="am-input-group-btn">
                    <button class="am-btn am-btn-default" type="submit">
                        <span class="am-icon-search"></span></button>
                    </span>
                </div>
            </form>

            <h2>分类</h2>

            <dl id="sort">
                <%for(sort in session.sorts){%>
                <dt data-am-collapse="{parent: '#sort', target: '.select-${sort.id}'}"><a class="side-a am-panel-title" href='#'>${sort.name}</a></dt>
                <%for(cate in session.category){%>
                <%if(cate.sortId==sort.id){%>
                <dd class="select-${sort.id} am-collapse"><a class="side-b" href="${base}/book/listBook?category=${cate.id}&page=1">${cate.name}</a></dd>
                <%}}%>
                <%}%>
            </dl>

        </div>
    </div>
</div>

<div id="user" class="am-offcanvas">
    <div class="am-offcanvas-bar am-offcanvas-bar-flip">
        <br>
        <br>

        <%if(session.user!=null){%>

        <div class="am-lg am-text-center">
            <%if(session.user.img==null){%>
            <img src="http://abc.whiteblue.xyz/aboutme/img/whiteblue.png" class="am-circle" style="width: 100px">
            <%}else{%>
            <img src="${user.head}" class="am-circle" style="width: 100px">
            <%}%>
            <br>
            <br>
        </div>

        <div class="am-offcanvas-content am-text-center">
            <h2>${session.user.name}</h2>

            <%if(msg!=0){%>

            <p><a style="color: brown" href="${base}/user/checkMsg">有${msg}个新回复</a></p>

            <%}%>

            <p>
                <a href="${base}/user/myInfo" type="button" class="am-btn am-btn-primary">信息</a>
                <a href="${base}/user/logout" type="button" class="am-btn am-btn-default">注销</a>
            </p>
        </div>

        <%}else{%>
        <div class="am-g am-lg-text-center">
            <p>
                <a href="${base}/login" type="button" class="am-btn am-btn-primary">登陆</a>
                <a href="${base}/register" type="button" class="am-btn am-btn-default">注册</a>
            </p>
        </div>
        <%}%>
    </div>
</div>

<div class="am-lg">
    <div class="side-bar">
        <a href="#" data-am-offcanvas="{target: '#doc-oc-demo2'}">
            <span class="btn am-icon-align-center am-icon-lg"></span>
        </a>
    </div>
    <div class="user-bar">
        <a href="#" data-am-offcanvas="{target: '#user'}">
            <%if(!has(msg)){%>
            <span class="btn am-icon-user am-icon-lg"></span>
            <%}else{%>
            <%if(msg!=0){%>
            <span class="btn am-icon-user am-icon-lg"></span><span class="am-badge am-round">${msg}</span>
            <%}else{%>
            <span class="btn am-icon-user am-icon-lg"></span>
            <%}}%>
        </a>
    </div>
</div>
